<template>
  <div class="app-container">
    <el-form @submit.native.prevent :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <span style="line-height: 32px;">{{data.spckmc}}</span>
      <span v-show="data.liid" style="margin-left:50px;line-height: 32px;">{{data.ckcw}}</span>
      <el-form-item label="条码" prop="bptm">
        <el-input v-model="data.bptm" placeholder="请输入条码" @keyup.enter.native="handleQuery"/>
      </el-form-item>
      <el-form-item label="" prop="allyCheck">
        <el-checkbox v-model="data.allyCheck" @keyup.enter.native="handleQuery">显示所有历史记录</el-checkbox>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
      </el-form-item>
      <el-form-item v-show="!data.liid">
        <el-button size="mini" @click="handleUpdate(null,'导出为Excel')"
                   v-hasPermi="['zhcloud:zdspck:export']"
        >导出为Excel</el-button>
      </el-form-item>
    </el-form>
    <el-table v-loading="loading" :data="list" :height="tableHeight">
      <af-table-column label="用户条码" align="center" prop="sptm" />
      <af-table-column label="仓库条码" align="center" prop="sptmc" />
      <af-table-column label="柜号" align="center" prop="spgh" />
      <af-table-column label="批号" align="center" prop="spbh" />
      <af-table-column label="仓库" align="center" prop="spckmc" />
      <af-table-column label="仓位" align="center" prop="ckcw" />
      <af-table-column label="件数" align="center" prop="spjs" />
      <af-table-column label="单重(KG)" align="center" prop="spjsl" />
      <af-table-column label="重量(吨)" align="center" prop="spsl" />
      <af-table-column label="物品规格" align="center" prop="spzs" />
      <af-table-column label="品牌" align="center" prop="spcd" />
      <af-table-column label="物品公司" align="center" prop="allName" />
      <af-table-column label="入仓日期" align="center" prop="ssrqid" />
      <af-table-column label="纱支" align="center" prop="wpggA" />
      <af-table-column label="工艺" align="center" prop="wpggB" />
      <af-table-column label="工序" align="center" prop="wpggC" />
      <af-table-column label="用途" align="center" prop="wpggD" />
      <af-table-column label="产地" align="center" prop="wpggE" />
      <af-table-column label="漂染性" align="center" prop="wpggF" />
      <af-table-column label="生产日期" align="center" prop="wpggG" />
      <af-table-column label="颜色" align="center" prop="wpggH" />
    </el-table>
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
  </div>
</template>

<script>
  import {stock} from "@/api/zdspck/api";
  export default {
    name: "Stock",
    data() {
      return {
        options: [],
        clientHeight: document.documentElement.clientHeight,
        tableHeight:500,// 定义table高度
        // 遮罩层
        loading: true,
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 仓库表格数据
        list: [],
        // 是否显示弹出层
        open: false,
        title:'',
        form:{
        },
        // 页码
        queryParams: {
          pageNum: 1,
          pageSize: 10
        },
        // 页码
        data: {
          liid:'',
          ckcw:'',
          bptm:'',
          ally3:'',
          allyCheck:false
        }
      };
    },
    mounted() {
      //  重置浏览器高度
      window.onresize = () => {
        this.clientHeight = document.documentElement.clientHeight;
      }
    },
    created() {
      this.getList();
    },
    watch: {
      '$route':{
        handler:function(to,from) {
          if(to.path === '/storage/storageSetting/zdspck/stock'){
            this.getList()
          }
        },
        deep:true
      }
    },
    methods: {
      getList() {
        this.loading = true;
        this.data.spckmc = decodeURIComponent(this.getQueryVariable('spckmc'));
        this.data.spckid = this.getQueryVariable('spckid');
        this.data.ckcw = decodeURIComponent(this.getQueryVariable('ckcw'));
        this.data.liid = this.getQueryVariable('liid');
        if (!this.data.spckid) {
          this.loading = false;
          return
        }
        if (this.data.allyCheck) {
          this.data.ally3 = '1'
        } else {
          this.data.ally3 = ''
        }
        stock(this.data, this.queryParams).then(response => {
          this.list = response.rows;
          this.total = response.total;
          this.loading = false;
        });
        //  初始值，自己定义
        this.tableHeight = this.clientHeight - 260
      },
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },
      handleUpdate(row,title) {
        if(title === '导出为Excel'){
          this.download('/storage/storageSetting/zdspck/exportStock', {
            ...this.data
          }, `excel-${new Date().getTime()}.xlsx`)
        }
      }
    }
  };
</script>
